<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1">
		<title>jQuery Mobile Bootstrap Theme</title>
		<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
		<link rel="stylesheet" href="http://cdn.jtsage.com/datebox/1.4.5/jqm-datebox-1.4.5.min.css" />
		<link rel="stylesheet" href="../themes/Bootstrap.css" />
		<link rel="stylesheet" href="../themes/jquery.mobile.icons.min.css" />
		<link rel="stylesheet" href="../stylesheets/style.css" />
		<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
		<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
		<script type="text/javascript" src="http://cdn.jtsage.com/datebox/1.4.5/jqm-datebox-1.4.5.core.min.js"></script>
    	<script type="text/javascript" src="http://cdn.jtsage.com/datebox/1.4.5/jqm-datebox-1.4.5.mode.calbox.min.js"></script>
    	<script type="text/javascript" src="../js/jquery.blockUI.js"></script>
    	<script type="text/javascript">
    	
    		var data = {};
			
			var nowdate = '';
		    $(document).ready(function(){
		    	initData();
				getList();
			
				
			});
			
			function initData() {
				
				data.type = 'srhNm';
				data.stock_nm =	$("#stock_nm").val(); 

			}
			
			
			function getList() {
			
				$.ajax({
				type: 'POST',
				url: '/search',
				data: JSON.stringify(data),
				dataType : "json", 
				contentType: 'application/json',
				beforeSend: function () {
			            $.blockUI({ 
			                message: '<img src="../themes/images/ajax-loader.gif" width="50" height="50"/>',
			                css: { 
			                    top:  ($(window).height() - 100) /2 + 'px', 
			                    left: ($(window).width() - 100) /2 + 'px',
			                    color:      '',
			                    border:     '',
			                    backgroundColor:'',                     
			                    width: '100px' 
			                }                
			                
			            }); 
			     },
				success : function(data){ // 성공시 data값.
				
					$.unblockUI(); 
					var newRows = '';
					
					if($.isArray(data) && data.length > 0  ){ //배열확인
						
						$.each(data,function(i){//loop
							newRows += '<tr>';
							newRows += '<td align="left"><a href="#empty-anchor" onclick="javascript:goInvstor(\''+data[i].stock_date+'\',\''+data[i].stock_cd+'\');"  data-rel="external">'+data[i].stock_nm+'</a></td>';
             				newRows += '<td align="right">'+data[i].closing_price+'원</td>';
             			
             				if(data[i].contrast == '2') { 
             					newRows += '<td><em class="up"><img src="/images/bigup.gif"/>'+ data[i].contvalue +'</em></td>';
             					newRows += '<td><em class="up">'+ data[i].fluctuation_rate +'%</em></td>';
             				} else if(data[i].contrast == '1') { 
								newRows += '<td><em class="up"><img src="/images/up.gif" />'+ data[i].contvalue +'</em></td>';
								newRows += '<td><em class="up">'+ data[i].fluctuation_rate +'%</em></td>';
							} else if(data[i].contrast == '0') { 
								newRows += '<td><em><img  src="/images/none.gif"/>0</em></td>';
								newRows += '<td><em>0%</em></td>';
							} else if(data[i].contrast == '-1') { 
								newRows += '<td><em class="down"><img src="/images/down.gif" />'+ data[i].contvalue +'</em></td>';
								newRows += '<td><em class="down">'+ data[i].fluctuation_rate +'%</em></td>';
							} else if(data[i].contrast == '-2') { 
								newRows += '<td><em class="down"><img src="/images/bigdown.gif" />'+ data[i].contvalue +'</em></td>';
								newRows += '<td><em class="down">'+ data[i].fluctuation_rate +'%</em></td>';
							}	
             			
             				newRows += '<td align="right">'+data[i].trading_volum+'</td>';
             				newRows += '</tr>';
						});
						
					} else {
						   newRows += '<tr>';
						   newRows += '<td colspan="6">데이타가 없습니다.</td>';
						   newRows += '</tr>';
					}
					
					$('#mytable tbody').empty()
							 .append( newRows )
							 .closest( "#mytable" )
		           			 .table("refresh" )
		                	 .trigger( "create" );
					
				},
			    error : function(request, status, error) {
			    
				 //통신 에러 발생시 처리
					alert("code : " + request.status + "\r\nmessage : " + request.reponseText +" \r\n error : " + error);
					$.unblockUI(); 
					}
				});
			}
			
			function goInvstor(dt,cd){
				$("#stock_cd").val(cd);
				$("#stock_date").val(dt);
				$("#form").submit();
			}
		
		</script>
    
   </head>
	<body>
		<div data-role="page" data-theme="a">
			<div data-role="header" data-position="inline">
				<h1>종목명 검색 결과</h1>
			</div>
			<div data-role="content" data-theme="a">
				<center>
					<img id="sign-logo" src="/images/ViewResults.png" />
					<h3> 종목명 검색 결과 리스트  </h3>
				</center>
				<font color="green">[<%=stock_nm%>]</font>에 대한 검색결과
          		<table id="mytable" data-role="table" id="table-custom-2" data-mode="columntoggle" class="ui-body-d ui-shadow table-stripe ui-responsive" data-column-btn-theme="a" data-column-btn-text="항목 선택" data-column-popup-theme="a">
		        	<thead>
		           		<tr class="ui-bar-a" >
		             		<th>종목명</th>
		             		<th data-priority="4">현재가</th>
		             		<th data-priority="3">전일대비</th>
		             		<th data-priority="5">등락률</th>
		             		<th data-priority="1"><abbr title="거래량">거래량</abbr></th>
		           		</tr>
		         	</thead>
		         	<tbody>
		         	
		         	</tbody>
		        </table>
			</div>
	      	<div data-role="footer" data-theme="a">
				<center> Copyright © 2015 UpDiosSystems Ins. </center> 
			</div> 
		</div>
		<form id="form" name="form" method="post" target="_self" action="/investor">
			<input type="hidden" id="stock_cd" name="stock_cd" value="" />
			<input type="hidden" id="stock_date" name="stock_date" value="" />
			<input type="hidden" id="stock_nm" name="stock_nm" value="<%=stock_nm%>" />
			<input type="hidden" id="path" name="path" value="find" />
		</form>
		
	</body>
</html>